import "./App.css";
// import PdfDiff from "./Compair";
// import WordDiffPreview from "./Docx";
// import Canvas from "./Canvas";
// import Iframe from "./Iframe";
import Home from "./home";
import { Parser } from 'node-sql-parser';
import ParticleAnimation from './ParticleAnimation';


function App() {

  /**
   * 用 node-sql-parser 解析 SQL 语句中的 SELECT 字段列表。
   * - 解析 SQL AST，提取字段名和别名
   * - 输出与 mysqlNodeResultParams 兼容的格式
   */
  function getSelectFields(sql) {
    const parser = new Parser();
    let ast;
    try {
      ast = parser.astify(sql);
    } catch (e) {
      return [];
    }
    const selectAst = Array.isArray(ast) ? ast[0] : ast;
    if (!selectAst || selectAst.type !== 'select' || !selectAst.columns) return [];
    return selectAst.columns.map((col, idx) => {
      // 优先用别名
      if (col.as) return { name: col.as, type: 'string', valueFieldName: col.as, id: idx };
      // 聚合函数表达式
      if (col.expr && col.expr.type === 'aggr_func') {
        // sum(res.sale_count) 取参数名
        if (col.expr.args && col.expr.args.value) {
          return { name: col.expr.args.value, type: 'string', valueFieldName: col.expr.args.value, id: idx };
        }
        if (col.expr.args && col.expr.args.column) {
          return { name: col.expr.args.column, type: 'string', valueFieldName: col.expr.args.column, id: idx };
        }
        // 兜底用函数名
        return { name: col.expr.name, type: 'string', valueFieldName: col.expr.name, id: idx };
      }
      // 普通字段
      if (col.expr && col.expr.column) return { name: col.expr.column, type: 'string', valueFieldName: col.expr.column, id: idx };
      // 字符串常量
      if (col.expr && col.expr.value) return { name: col.expr.value, type: 'string', valueFieldName: col.expr.value, id: idx };
      // 兜底
      return { name: `col${idx}`, type: 'string', valueFieldName: `col${idx}`, id: idx };
    });
  }

  // 预处理 SQL，将 #{xxx} 或 #{xxx[0]} 替换为 1，便于 SQL 解析器处理
  function preprocessSql(sql) {
    return sql.replace(/#\{[a-zA-Z0-9_]+(\[\d+\])?\}/g, '1');
  }

  const sqlStatement = `SELECT
sum(res.sale_count) as total_count,
res.app_id as app_id,
res.sync_month as retail_statistics,
sum(res.rnr_count) as rnr_count
FROM (SELECT count(1) as sale_count,
         count(t2.audit_status = 2) as rnr_count,
         DATE_FORMAT(t1.\`sync_time\`, '%Y-%m') as sync_month,
         CASE t1.app_id WHEN 'spark-core' THEN 1 WHEN 'spark-uc' THEN 2 WHEN 'spark-fsm' THEN 1 ELSE t1.app_id END as app_id
  FROM \`uc_vehicle_sale_info\` t1
          LEFT JOIN uc_rnr_application t2  on  t1.\`vin\` = t2.\`vin\` and t2.\`audit_status\` = 2 and t2.status = 1
  where
      t1.sale_type = '01' 
      and t1.\`valid\` = 1
      and
      CASE
          WHEN #{app_id} = 1 THEN t1. app_id in  ('spark-core','spark-fsm')
          WHEN #{app_id} = 2 THEN t1. app_id in  ('spark-uc')
          ELSE t1.app_id in ('spark-core','spark-fsm','spark-uc')
          END
              and ((#{retail_statistics} is null
                  or #{retail_statistics[0]}= ''
                  or #{retail_statistics[1]}= '')
                  or t1.sync_time between #{retail_statistics[0]} and #{retail_statistics[1]})
                  group by DATE_FORMAT(t1.\`sync_time\` ,'%Y-%m'),t1.app_id  ) res
                  group by res.app_id,res.sync_month
                  ORDER BY res.sync_month desc,app_id asc
`
const sqlStatement1 = `select count(1) as total_count,
IFNULL(\`report_status\`, '总计') AS \`report_status\`
from \`uc_rnr_application\` t1 
where t1.source = 1 
and (t1.\`owner_status\` = 2 or t1.\`user_rnr_status\` = 5)  
and t1.status = 1
and EXISTS (select 1 from \`uc_vin_cd_state\` t2 where t1.vin = t2.vin) 
group by \`report_status\` WITH ROLLUP`

const preprocessedSql = preprocessSql(sqlStatement1);
const params = getSelectFields(preprocessedSql);
console.log(params, 'params========');
const mysqlNodeResultParams = params;
console.log(mysqlNodeResultParams, '========');

  return (
    <div className="App">
      {/* <PdfDiff
        pdf1="/Toto_back.pdf"
        pdf2="/Toto.pdf"
      /> */}
      {/* <WordDiffPreview /> */}
      {/* <Home /> */}
      <div style={{ width: '100vw', height: '100vh' }}>
         <ParticleAnimation />
       </div>
    </div>
    
  );
}

export default App;
